<template>
    <view class="container" :style="themeColor">
        <search-bar :placeholderText="placeholderText" @searchFn="searchFn"></search-bar>
        <view class="main">
            <mescroll-uni
                @init="mescrollInit"
                :height="listHeight"
                :down="downOption"
                @down="refresh"
                :up="upOption"
                @up="getData">
                <product-item
                    v-for="(item, index) in datas"
                    :key="item.ID"
                    :index="index"
                    :seletData="seletData"
                    :data="item"
                    @select="select"></product-item>
            </mescroll-uni>
            <select-cart :data="seletData" @affirm="affirm"></select-cart>
        </view>
    </view>
</template>
<script>
import { GetWholeSaleProductPageList } from "@/service/api/product.js"
import { getWholeSaleListForSku } from "@/service/api/product.js"
import { getElementHeight } from "@/uni-sub-base/utils/elementUtil.js"
import searchBar from "@/components/common/search-bar.vue"
import productItem from "@/pages_me/components/coupon/product-item.vue"
import selectCart from "@/pages_me/components/coupon/select-cart.vue"
export default {
    components: {
        searchBar,
        productItem,
        selectCart,
    },
    data() {
        return {
            placeholderText: "输入商品名称",
            listHeight: "",
            datas: [],
            param: {
                OrderBy: "display_sequence",
                ProductType: 1,
                Sort: "desc",
                infoType: 0,
                typePath: "_0_2_",
            },
            limit: [],
            seletData: [],
        }
    },

    onLoad(e) {
        if (e.limitIds && e.limitIds != "undefined") {
            this.limitIds = e.limitIds
            this.limit = e.limitIds.split(",")
        }
    },
    mounted() {
        this.getListHeight()
        //#ifdef H5
        this.refresh()
        //#endif
    },
    onShow() {},
    methods: {
        refresh() {
            this.datas = []
            this.mescroll.resetUpScroll()
        },
        goUrl(url) {
            this.easyGoTo(url)
        },
        searchFn(searchText) {
            //搜索
            this.param.search = searchText
            this.refresh()
        },
        //获取列表高度
        getListHeight() {
            //获取商品高度
            getElementHeight(this, ".main", (e) => {
                this.listHeight = e - 60 + "px"
            })
        },
        getData(page) {
            let param = this.param
            param.pageSize = page.size
            param.pageIndex = page.num
            getWholeSaleListForSku(param).then((res) => {
                if (res.State) {
                    this.total = res.Data.Data.RecordAmout
                    this.mescroll.endBySize(res.Data.Data.length, res.RecordAmout)
                    res.Data.Data.forEach((e) => {
                        this.$set(e, "checked", false)
                    })
                    if (this.limit.length > 0) {
                        this.limit.forEach((e, index, arr) => {
                            res.Data.Data.forEach((res, resindex, resarr) => {
                                if (arr[index] == resarr[resindex].ID) {
                                    resarr[resindex].checked = true
                                    this.seletData.push(res)
                                }
                            })
                        })
                    }
                    this.datas = this.datas.concat(res.Data.Data)
                }
            })
        },
        select(data, index) {
            this.datas[index] = data
            this.seletData = []
            this.datas.forEach((e) => {
                if (e.checked) {
                    this.seletData.push(e)
                }
            })
            this.$forceUpdate()
        },
        dataChange(data) {
            this.seletData = data
            if (data.length == 0) {
                this.datas.forEach((e) => {
                    e.checked = false
                })
            } else {
                this.seletData.forEach((e, index, arr) => {
                    this.datas.forEach((res, resindex, resarr) => {
                        if (arr[index].ID == resarr[resindex].ID) {
                            resarr[resindex].checked = true
                        } else {
                            resarr[resindex].checked = false
                        }
                    })
                })
            }
        },
        returnData(data) {
            const eventChannel = this.getOpenerEventChannel()
            eventChannel.emit("getSelectData", {
                data,
            })
            this.easyGoBack()
        },
        affirm(data) {
            this.returnData(data)
        },
    },
}
</script>

<style lang="scss"></style>
